<template>
    <el-form :model="form" label-width="auto" style="max-width: 600px">
        <el-form-item label="物料清单编码">
            <el-input v-model="form.itemManifestCode" />
        </el-form-item>
        <el-form-item label="物料清单版本">
            <el-input v-model="form.itemManifestVersion" />
        </el-form-item>
        <el-form-item label="物料选择">
            <el-select v-model="form.chooseId" placeholder="请选择">
                <el-option v-for="a in inventoryInfo" :key="a.chooseId" :label="a.chooseName" :value="a.chooseId" @click="getunit()" />
            </el-select>
        </el-form-item>
        <el-form-item label="物料清单描述">
            <el-input v-model="form.itemDesc" />
        </el-form-item>
        <el-form-item label="物料单位">
            <el-select v-model="form.itemUnit" placeholder="请选择">
                <el-option label="克" value="克" />
                <el-option label="次" value="次" />
            </el-select>
        </el-form-item>
        <el-form-item label="物料规格">
            <el-select v-model="form.itemSpecs" placeholder="请选择">
                <el-option label="千克" value="千克" />
                <el-option label="克" value="克" />
            </el-select>
        </el-form-item>
        <el-form-item label="制单人">
            <el-input v-model="form.sheetPeople" />
        </el-form-item>
        <el-form-item label="制单部门">
            <el-select v-model="form.departmentId" placeholder="请选择">
                <el-option label="JAVA组" value=1 />
            </el-select>
        </el-form-item>
        <el-form-item label="状态">
            <el-select v-model="form.itemState" placeholder="请选择">
                <el-option label="有效" :value=true />
                <el-option label="无效" :value=false />
            </el-select>
        </el-form-item>
        <el-button type="success" v-model="form.pid" @click="add()">添加</el-button>

    </el-form>
    <el-button @click="Zeng()">新增物料清单行</el-button>
    <el-dialog v-model="form.dialogFormVisible" title="物料清单编辑" width="500">
        <el-form :model="form">
            <el-form-item label="顺序">
                <el-input v-model="formm.rowOrder" />
            </el-form-item>
            <el-form-item label="工序">
                <el-select v-model="formm.process" placeholder="请选择">
                    <el-option label="锡" value="锡" />
                </el-select>
            </el-form-item>
            <el-form-item label="物料选择">
                <el-select v-model="formm.chooseId" placeholder="请选择">
                    <el-option v-for="a in inventoryInfo" :key="a.chooseId" :label="a.chooseName" :value="a.chooseId"
                        @click="getattr(), getspec()" />
                </el-select>
            </el-form-item>
            <el-form-item label="物料属性">
                <el-input v-model="formm.rowAttribute" />
            </el-form-item>
            <el-form-item label="规格">
                <el-input v-model="formm.specName" />
            </el-form-item>

            <el-form-item label="子件bom版本">
                <el-select v-model="formm.version" placeholder="请选择">
                    <el-option label="版本69" value="版本69" />
                    <el-option label="版本34" value="版本34" />
                    <el-option label="版本96" value="版本96" />
                    <el-option label="版本51" value="版本51" />
                    <el-option label="版本53" value="版本53" />
                    <el-option label="版本16" value="版本16" />
                </el-select>
            </el-form-item>
            <el-form-item label="生产前置期">
                <el-input v-model="formm.leadPeriod" />
            </el-form-item>
            <el-form-item label="数量">
                <el-input v-model="formm.num" />
            </el-form-item>
            <el-form-item label="状态">
                <el-select v-model="formm.rowState" placeholder="请选择">
                    <el-option label="有效" value="有效" />
                    <el-option label="无效" value="无效" />
                </el-select>
            </el-form-item>
        </el-form>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="ti(), getlist()">添加</el-button>
                <el-button @click="jiao()">添加</el-button>
            </div>
        </template>
    </el-dialog>


    <el-table :data="list" style="width: 100%">
        <el-table-column prop="rowId" label="序号" />
        <el-table-column prop="rowOrder" label="顺序" />
        <el-table-column prop="process" label="工序" />

        <el-table-column prop="version" label="bom版本" />
        <el-table-column prop="rowAttribute" label="属性名称" />
        <el-table-column prop="specName" label="单位" />
        <el-table-column prop="num" label="数量" />
        <el-table-column prop="leadPeriod" label="生产前置期" />
        <el-table-column prop="handleTime" label="创建时间">
            <template v-slot="scope">
                {{ scope.row.handleTime.substring(0, 10) }}
            </template>
        </el-table-column>
        <el-table-column prop="handle" label="创建人" />
        <el-table-column prop="rowState" label="状态" />
        <el-table-column label="操作">
            <template v-slot="scope">
                <el-button>删除</el-button>
                <el-button>编辑</el-button>
            </template>
        </el-table-column>
    </el-table>
</template>
<script setup lang="ts">
import { reactive, ref, onMounted } from 'vue'
import { ElMessage } from 'element-plus'
import { useRouter } from 'vue-router'
import axios from 'axios'
const apiurls = import.meta.env.VITE_APP_API_URL_ProductionAdd;
const apiurl = import.meta.env.VITE_APP_API_URL_ProductionShow;
const router = useRouter()
const form = reactive({
    dialogFormVisible: false,
    itemId: 0,
    itemManifestCode: "",
    itemManifestVersion: "",
    chooseId: "",
    itemDesc: "",
    itemUnit: "",
    itemSpecs: "",
    sheetPeople: "huangqiao678",
    departmentId: "",
    itemState: '',
    isDelete: true,
    handle: "MaxAdmin",
    handleContext: "添加物料清单",
    handleTime: "",
    pid: 1
});
const formm = reactive({
    rowId: 0,
    rowOrder: "",
    process: "",
    chooseId: 0,
    rowAttribute: "",
    specName: "",
    version: "",
    leadPeriod: 0,
    num: 0,
    rowState: "",
    handle: "MaxAdmin",
    handleContext: "添加",
    handleTime: "",
    pid: 1,
    isDelete: true
})
//弹框新增
const ti = () => {
    axios.post("http://localhost:5104/api/Material/AddRowBillMaterial", {
        rowId: formm.rowId,
        rowOrder: formm.rowOrder,
        process: formm.process,
        chooseId: formm.chooseId,
        rowAttribute: formm.rowAttribute,
        specName: formm.specName,
        version: formm.version,
        leadPeriod: formm.leadPeriod,
        num: formm.num,
        rowState: formm.rowState,
        IsDelete: false,
        handle: formm.handle,
        handleContext: formm.handleContext,
        handleTime: new Date(),
        pid: 1
    }).then(res => {
        if (res.data.code > 0) {
            console.log(res.data)
            ElMessage.success("添加成功")
            form.dialogFormVisible = false

        } else {
            console.log(res.data)
            ElMessage.error("添加失败")
        }
    })
}
//行显示
const list = ref([])
const getlist = () => {
    axios.post(apiurl + '/api/ShowMaterial/GetRowBillMateria', {

    }).then(res => {
        console.log(res.data)
        list.value = res.data.data

    })
}
//新增弹框设置
const Zeng = () => {
    form.dialogFormVisible = true
}
const jiao=()=>{
    router.push({ name: 'MaterialPlanningList' })
}
//物料选择下拉框
const inventoryInfo:any = ref([])
const getinventoryInfo = () => {
    axios.post(apiurl + '/api/ShowMaterial/GetSelection', {}).then(res => {
        inventoryInfo.value = res.data.data
    })
}
//单位选择下拉框
const unit:any = ref([])
const getunit = () => {
    axios.post(apiurl + '/api/ShowMaterial/GetItemUnit', {

    }).then(res => {
        unit.value = res.data.data
    })
}
//物料属性返填
const getattr = () => {
    axios.post(apiurl + '/api/ShowMaterial/GetAttributeRow', {
        chooseId: formm.chooseId
    }).then(res => {
        if (res.data.code > 0) {
            formm.rowAttribute = res.data.data.rowAttribute
        }

    })
}
//规格返填
const getspec = () => {
    axios.post(apiurl + '/api/ShowMaterial/GetSpecs', {
        chooseId: formm.chooseId
    }).then(res => {
        if (res.data.code > 0) {
            formm.specName = res.data.data.materialSpecsName
        }

    })
}
//添加物料清单
const add = () => {
    axios.post(apiurls + '/api/Material/AddBillMaterial', {
        itemId: form.itemId,
        itemManifestCode: form.itemManifestCode,
        itemManifestVersion: form.itemManifestVersion,
        chooseId: form.chooseId,
        itemDesc: form.itemDesc,
        itemUnit: form.itemUnit,
        itemSpecs: form.itemSpecs,
        sheetPeople: form.sheetPeople,
        departmentId: form.departmentId,
        itemState: form.itemState,
        IsDelete: false,
        handle: form.handle,
        handleContext: form.handleContext,
        handleTime: new Date(),
        pid: 1
    }).then(res => {
        if (res.data.code > 0) {
            console.log(res.data)
            ElMessage.success("添加成功")
            // router.push({ name: 'BillMaterialsList' })
        } else {
            console.log(res.data)
            ElMessage.error("添加失败")
        }
    })
}
onMounted(() => {
    getinventoryInfo()
})
</script>
